
### Class Architecture

| Type    | Class Name   | Description                                                                                                                                                                             |
| ------- | ------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Element | `.as-html`   | The root block applied to the `<html>` element. It acts as the primary hook for global CSS variables, typography resets, and language-specific styling logic.                           |
| Element | `.as-body`   | The main container block for the document body. It manages the global background, flex-direction (to push the footer down), and overflow behaviors.                                     |
| Element | `.as-routes` | The routing wrapper. In a Blazor or SPA environment, this block encapsulates the dynamic content area where different pages are injected, serving as the boundary for view transitions. |

### Implementation Reference

##### Generated HTML

```html
<!DOCTYPE html>  
<html lang="@Language" class="as-html">  
  
<head>  
    <meta charset="utf-8"/>  
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>  
    <base href="/"/>  
</head>  
  
<body class="as-body">  
<div class="as-routes">  
	...
</div>  
  
</html>
```

##### SCSS

```scss
.as-html {  
  height: 100% !important;  
}  
  
.as-body {  
  height: 100% !important;  
}  
  
.as-routes {  
  height: 100% !important;  
  display: flex !important;  
  flex-direction: column !important;  
}
```

